<!DOCTYPE html>
<!--html注释-->
<script>
	//html注释
	//html标签tag，元素element、节点node
	//最大标签是根元素
</script>
<html>
	<head>
		<!-- head头标签包含了当前文档的元数据meta：可以设置 -->
		<!-- 页面信息，引用等等 -->
		<!-- SEO搜索引擎优化 -->
		<meta charset="utf-8">
		<meta name="keywords" content="网站关键字">
		<meta name="description" content="网站描述">
		<!-- viewport 目的是让浏览器解析时可以使用该属性使用何种缩放比例 -->
		<!-- 在不同设备中看到的样子不一样 -->
		
		
		<link rel="stylesheet" href="./css/layui/css/layui.css">
		<title>html初学笔记、开始使用 layui</title>
	</head>
	<body>
		<script src="./css/layui/layui.js"></script>
		<blockquote class="layui-elem-quote" style="margin-top: 30px;">
		  <div class="layui-text">
		    <ul>
			  <li>html是用来描述网页的一种语言</li>
			  <ul>
				  <li>hhh</li>
			  </ul>
		    </ul>
			<ul>
				<li>域名 localhost/IP 127.0.0.1</li>
			</ul>
			<ul>
				<li>💖💦♈⛎💟💝🔯</li>
			</ul>
		  </div>
		</blockquote>
		
		  <table class="layui-table-box" border="1">
			  <tr>
				  <div id="test1">
				    <script src="../src/layui.js"></script>
				    <script>
				    layui.use('tree', function(){
				      var tree = layui.tree;
				      //渲染
				      var inst1 = tree.render({
				        elem: '#test1'  //绑定元素
				        ,data: [{
				          title: '江西',id:'001' //一级菜单
				          ,children: [{
				            title: '南昌',id:'0011' //二级菜单
				          }]
				        },{
				          title: '陕西',id:'002' //一级菜单
				          ,children: [{
				            title: '西安',id:'0021' //二级菜单
				          }]
				        }]
				      });
				    });
				    </script>
				    </div>
			  </tr>
			  <tr>
				  <td>
				  不同的标签名固有的显示效果不同除了内容外的部分一般都是固有的
				  <! -- <xX yy= "xx" ao="bb" cc= 'dd ' > --><p/>
				  标签属性属性名1=“属性值1”属性名2='属性值2'不同的属性名或属性值会导致标签功能作用不同<div name="" style=''></ div>
				  全局属性
				  <div id = "" class="" style='' title=' ' name="" 
				  </div>id=唯一标识(规定当前标签的唯一性) 不能重复
				  </td>
			</tr>
			<tr>
				<td>
					  常用属性
					  < ! --超链接-->
					  <a href="http://www.baidu.com" tanget="_self">AAA</a>
					  <a href="http://www.baidu.com" target="_blank " >BBB</a>
					  <a href="http : / / www . baidu.com">cCc< / a>
					  <l - - image图片--><p></p>
					  静态网页
					  绝对路径
					  <img src="D :\Dxoffice\workspace [hxitest211220\img\fei. png"/>相对路径
					  <img src="../../img/fei.png"/><img src="../../img/fei.png”/><img src="fei.png"/>
				</td>
			</tr>
			<tr>
				<td>
					<img src="../../img.png" alt="这是一张图片" width="" height=""/>
				</td>
			</tr>
			<tr>
				<td>
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;💚<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;💚💚<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;💚💚💚<br />
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;💚💚💚💚<br />
					&nbsp;&nbsp;&nbsp;💚💚💚💚💚<br />
					💚💚💚💚💚💚
					
				</td>
			</tr>
			<tr>
				<td>
					<a href="http://www.baidu.com">超链接</a>
					<a href="http://www.baidu.com">
						<img src="" />
					</a>
					<a href="mailto:12345@qq.com">
						Email
						<!-- 点击此处就会使用浏览器中设置好的邮件功能向改地址发送邮件 -->
					</a>
						<a href="#tips">锚点跳转</a>
						<br /><br /><br /><br /><br />
						<br /><br /><br /><br /><br />
						<br /><br /><br /><br /><br />
						<div id='tips'>123</div>
				</td>
			</tr>
			<tr>
				<td>
					<!-- 文本操作标签 -->
					<b>AAAAA</b>
					<code>BBB</code>
					<em>cCC</em>
					<i>DDD</i>
					<pre>EEE</pre>
					<small>FFF</small>
					<strong>GGGG</strong>
					<abbr>333</ abbr>
					<address>IIII</address>
					<bdo>KKKK</bdo>
					<blockquote>HHH</blockquote>
					<cite>QQ</cite>
					<del>wwWl</del>
					<ins>PPPP</ins>
					<sub>XXX</sub>
					<sup>YYY</sup>
				</td>
			</tr>
		  </table>
		  无序列表
		  <ul>
			<li>3</li>
			<li>2</li>
			<li>1</li>
		  </ul>
		有序列表
		<ol>
			<li>3</li>
			<li>2</li>
			<li>1</li>
		</ol>
		<dl>
			会自动缩进的自定义列表
			<dt>hhhh</dt>
				<dd>fsf</dd>
			<dt>dkfjslfj</dt>
				<dd>fsf</dd>
			<dt>slfslkf</dt>
				<dd>fsf</dd>
		</dl>
		  
	</body>
</html>

